<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="card6.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
</head>
<body>
    <section>

        <div class="box1 box">
          <div class="content">
            <div class="image">
              <img src="https://i.postimg.cc/bryMmCQB/profile-image.jpg" alt="Profile Image">
            </div>
            <div class="level">
              <p>PRO</p>
            </div>
            <div class="text">
              <p class="name">Pravin Nandankar</p>
              <p class="job_title">UI / UX Designer</p>
              <p class="job_discription">Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam atque, ipsam a amet laboriosam eligendi.</p>
            </div>
            <div class="icons">
              <button>
                <ion-icon name="logo-dribbble"></ion-icon>
              </button>
              <button>
                <ion-icon name="logo-instagram"></ion-icon>
              </button>
              <button>
                <ion-icon name="logo-twitter"></ion-icon>
              </button>
              <button>
                <ion-icon name="logo-linkedin"></ion-icon>
              </button>
              <button>
                <ion-icon name="logo-facebook"></ion-icon>
              </button>
              <button>
                <ion-icon name="logo-behance"></ion-icon>
              </button>
            </div>
            <div class="button">
              <div>
                <button class="message" type="button">Message</button>
              </div>
              <div>
                <button class="connect" type="button">Connect</button>
              </div>
            </div>
          </div>
        </div>
      
        <div class="box2 box">
          <div class="content">
            <div class="row">
              <div class="image">
                <img src="https://i.postimg.cc/bryMmCQB/profile-image.jpg" alt="Profile Image">
              </div>
              <div class="post">
                <p>Post</p>
                <h5>28</h5>
              </div>
              <div class="followers">
                <p>Followers</p>
                <h5>678</h5>
              </div>
              <div class="following">
                <p>Following</p>
                <h5>120</h5>
              </div>
            </div>
            <div class="text">
              <p class="name">Pravin Nandankar</p>
              <p class="job_title">UI / UX Designer</p>
              <p class="about">About</p>
              <p class="job_discription">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dolores, placeat obcaecati. Eaque fugit eveniet error voluptates totam enim molestias vitae, amet aliquid deleniti ipsa ea.</p>
            </div>
          </div>
        </div>
      
      </section>
      
      <script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
      <script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script>
</body>
</html>